.title {
	font-size: 32rpx;
	border-left: 4rpx solid #ffffff;
	line-height: 32rpx;
	padding-left: 16rpx;
	color: #333333;
	font-weight: bold;
	margin-left: -19rpx;
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 20rpx;
}
 
.title-d {
	font-size: 28prx;
	border-left: 4rpx solid #ffffff;
	line-height: 28rpx;
	padding-left: 16rpx;
	color: #333333;
	font-weight: bold;
	margin-left: -19rpx;
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding-bottom: 18rpx;

	.key-setting {
		color: #666666;
		font-size: 25rpx;
		font-weight: normal;
	}
}
.personBtn {
	display: flex;
	justify-content: flex-end;
	height: 40rpx;
}
.date-type {
	color: #666666;
	background: #f3f6f8;
	border-radius: 4rpx;
	font-size: 24rpx;
	padding: 10rpx 16rpx;
	font-weight: normal;
	display: flex;
	align-items: center;
	justify-content: center;
	letter-spacing: 1rpx;
	image {
		width: 20rpx;
		height: 20rpx;
		margin-left: 3rpx;
	}
}
.special{
	justify-content: start;
	width: 74rpx;
	// height:40rpx;
	padding: 10rpx 16rpx;
	position: absolute;
	top: 100rpx;
}
.data-change {
	color: #0091ff;
	font-size: 24rpx;
	padding: 3rpx 0rpx;
	font-weight: normal;
	display: flex;
	line-height: 22rpx;
	align-items: center;
	justify-content: center;
	letter-spacing: 1rpx;
	image {
		width: 40rpx;
		height: 40rpx;
		padding-top: 4rpx;
		margin-right: 3rpx;
	}
}
.mbs-type {
	color: #666666;
	background: #f3f6f8;
	border-radius: 4rpx;
	font-size: 24rpx;
	padding: 10rpx 16rpx;
	font-weight: normal;
	display: flex;
	align-items: center;
	justify-content: center;
	letter-spacing: 1rpx;
	margin-right: 10rpx;
	image {
		width: 30rpx;
		height: 30rpx;
		margin-right: 3rpx;
	}
}
.light {
	border-left: 4rpx solid #0091ff;
}

.num-block {
	width: 100%;
	display: flex;
	align-items: center;
	padding: 40rpx 0;
	padding-top: 20rpx;
	.line {
		width: 2rpx;
		height: 60rpx;
		background-color: #eee;
	}
	&-item {
		flex: 1;
		text-align: center;
		.num {
			font-size: 36rpx;
			font-weight: bold;
			color: #333;
		}
		.name {
			font-size: 26rpx;
			padding-top: 5rpx;
			color: #999999;
		}
	}
}

.chart-total {
	width: 100%;
	display: flex;
	color: #666666;
	font-size: 28rpx;
	align-items: center;
	margin-bottom: 40rpx;
	&-count {
		flex: 1;
		text-align: center;
		text {
			color: #333;
			font-weight: bold;
		}
	}
	&-detail {
		width: 282rpx;
		text-align: right;
		display: flex;
		justify-content: flex-end;
		align-items: center;
		color: #0091ff;
		font-size: 26rpx;
		view {
			display: flex;
			align-items: center;
			padding: 10rpx 20rpx;
			padding-right: 0rpx;
		}
		image {
			width: 25rpx;
			height: 25rpx;
			margin-left: 10rpx;
		}
	}
}

.line-chart-unit {
	width: 98%;
	color: #999;
	font-size: 22rpx;
	display: flex;
	justify-content: space-between;
	padding: 0 1%;
}
.line-chart {
	width: 100%;
	height: 200px;
	display: flex;
	justify-content: center;
	align-items: center;
	.line {
		width: 100%;
		height: 200px;
	}
}
.chart-block {
	width: 100%;
	height: 200px;
	.ring {
		width: 100%;
		height: 200px;
	}
}

.data-types {
	width: 100%;
	// padding-top: 18rpx;
	padding: 20rpx 0;
	display: flex;
	justify-content: space-between;
	align-items: center;
	&-right {
		display: flex;
		justify-content: flex-end;
		align-items: center;
	}
}

.tag-block {
	width: 100%;
	display: flex;
	align-items: center;
	margin-bottom: 12rpx;
	&-item {
		color: #666666;
		background: #f3f6f8;
		font-size: 24rpx;
		margin-right: 20rpx;
		border-radius: 2rem;
		padding: 10rpx 16rpx;
	}
	.act {
		color: #0091ff;
		background: #dcf0ff;
	}
}
